import React, { Component } from 'react';
import {
	StyleSheet, PixelRatio, View, Image, Text, ScrollView, TouchableOpacity
} from "react-native";
import { GLOBAL } from '../../../config/global';
import StorageHelper from '../../../utils/storageHelper';
import { STORAGE_CONSTANT } from '../../../config/storage';
import { style } from '../../../theme/style';
import { Common } from '../../../component/common/Common';
import MethodUtil from '../../../utils/MethodUtil';
import { HeadTab } from './_common/headTab';
import { PageStatusIndex } from '../../../component/page-status/PageStatusIndex';
import CreditService from './_common/service.js';
import { TabItem } from './component/TabItem.js';
import { BoxShadow } from 'react-native-shadow';
import { NewAccount } from '../../../components/common/newAccount';
import { SlideSelect } from '../../../components/common/slideSelect';
import { Loading } from '../../../component/page-status/Pageloading';
import moment from 'moment';

const scale = GLOBAL.SCALE;
const imgUrl = require('../../../imgs/select.png')
export class BillPage extends Component {

	static navigationOptions = ({ navigation }) => {
		return {
			header: null,
			// headerTintColor: style.color.white,
			// headerLeft: <Common type="headLeft" onPress={() => { navigation.goBack() }} color='#fff' />,
			// headerRight: (<Image style={{ marginLeft: 18 * scale, width: 9 * scale, height: 16 * scale }} source={require('../../../imgs/goBackEmpty.png')} />),
			// headerStyle: style.head.headerStyle,
			// headerTitleStyle: {
			// 	flex: 1,
			// 	textAlign: 'center',
			// }
		}
	};

	constructor(props) {
		super(props);
		let { companyName, companyId, corpType, choice } = props.navigation.state.params || {};
		this.onoff = companyId || false;   // 判断是不是传进来的id
		this.typeData = [
			{ dictKey: 'SX', dictName: '赊销' },
			{ dictKey: 'YF', dictName: '预付' }
		]
		corpType = corpType || 0;
		this.state = {
			// 授信类型
			typeModal: false,
			typeData: this.typeData,
			typeValue: this.typeData[corpType].dictName,
			typeKey: this.typeData[corpType].dictKey,
			tabIndex: 0,  // tab 显示节点
			companyName: companyName || '请先选择企业',
			companyId: companyId || false,
			typeIndex: 0,
			tableKey: 'REAL_OCCUPY',
			loader: false,
			alertShow: false,
			options: [],
			choice: choice || {},
			tabLoading: false,
			showDetail: false
		}
		this.tabData = [
			{ title: '实际占用', key: 'REAL_OCCUPY' },
			{ title: '合同占用', key: 'CONTRACT_OCCUPY' },
			{ title: '审批占用', key: 'AUDIT_OCCUPY' },
			{ title: '订单变更占用', key: 'CHANGE_OCCUPY' },
		];
		this.datialData = {}  // 详情
		this.listData = {}; //tab 数据
		this.timeStr = '--';
	}

	async componentWillMount() {
		await this.getSorage();
		await this._init();
	}

	//获取业务组织
	async getSorage() {
		const userInfoJson = await StorageHelper.get(STORAGE_CONSTANT.USER_INFO_KEY);
		const userInfo = JSON.parse(userInfoJson);
		this.setState({
			options: userInfo.corpInfoTOs || [],
			choice: this.state.choice.corpId ? this.state.choice : userInfo.corpInfoTOs[0]
		}, () => {
			this._goSupplier();
		})
	}

	//初始化数据
	_init = async () => {
		let { companyId, typeKey, choice } = this.state;
		let detailParams = {
			companyId,
			creditKind: typeKey,
			corpId: choice.corpId
		}
		this.setState({
			loader: false
		})
		let detailData = await CreditService.billDetail(detailParams);
		if (detailData) {
			this.datialData = detailData;
			await this._getTabData();
		}
		this.setState({
			loader: true
		})

	}


	// 获取底部tab 数据
	_getTabData = async () => {
		let { companyId, typeKey, tableKey, choice } = this.state;
		let listParams = {
			companyId,
			creditKind: typeKey,
			occupyType: tableKey,
			corpId: choice.corpId
		}
		let responseData = await CreditService.billList(listParams);
		if (JSON.stringify(responseData) != "{}") {
			var bigArr = [];
			for (key in responseData) {
				var lsObj = {};
				lsObj.title = key;
				var lsArr = [];
				for (var i = 0; i < responseData[key].length; i++) {
					lsArr.push(responseData[key][i]);
				}
				lsObj.list = lsArr;
				bigArr.push(lsObj);
			}
			this.listData[tableKey] = bigArr;
		} else {
			this.listData[tableKey] = null;
		}
		console.log('this.tabLoading-结束', this.state.tabLoading)
		this.setState({
			tabLoading: false
		})
	}

	// tab 点击函数
	_tabClick = (index) => {
		this.setState({
			tabIndex: index,
			tableKey: this.tabData[index].key,
			tabLoading: true
		}, () => {
			this._getTabData();
		})
	}

	// tab 下的空数据
	_rendenEmpty = () => {
		return (
			<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', marginTop: -20 * scale }}>
				<PageStatusIndex emptyText={'暂无授信账单'} status="empty" />
			</View>
		)
	}

	//打开模态框
	_selecOpen = () => {
		this.setState({
			typeModal: true
		})
	}

	//关闭
	_closeModal = () => {
		this.setState({
			typeModal: false
		})
	}

	// 类型 点击
	_typeCallBack = (index) => {
		this.listData = {};  // 从新初始化
		this.setState({
			typeValue: this.typeData[index].dictName,
			typeKey: this.typeData[index].dictKey,
			typeModal: false,
			typeIndex: index
		}, () => {
			this._init();
		})
	}

	// 跳转到企业列表
	_goSupplier = () => {
		if (this.onoff) {// 成交报告进来的页面
			return;
		}
		let { isSelect } = this.props.navigation.state.params || {};
		let { companyName, companyId, choice } = this.state;
		this.props.navigation.navigate('SeachSupplierPage', {
			isSelect: isSelect || false,
			choice,
			isAgent: null,
			companyName,
			companyId,
			type: 'BillPage',
			code: 'SX',
			callBack: (data) => {
				console.log('data', data)
				this.setState({
					companyName: data.companyName,
					companyId: data.companyId
				}, () => {
					this.listData = {};
					this._init();
				})
			}
		})
	}

	_callBack = () => {
		this._init();
	}




	render() {
		console.log('页面刷新')
		let { typeModal, typeData, typeIndex, typeValue, companyName, loader, alertShow, choice, options } = this.state;
		let { creditAmount } = this.datialData;
		return (
			<View style={styles.container}>
				<View style={styles.headBox}>
					<View style={styles.topBox}>
						<View style={{ flex: 1 }}>
							<Common type="headLeft" onPress={() => { this.props.navigation.goBack() }} color='#fff' />
						</View>
						<Text style={styles.topTitle}>授信账单</Text>
						<View style={{ flex: 1 }}>
							{options.length > 1 ?
								<NewAccount fn={(val) => { this.setState({ alertShow: val }) }} choice={choice.corpName || ''} accountStyles={{ paddingTop: 9 * scale }}
									imgUrl={imgUrl} imgStyle={{ width: 10, height: 5, tintColor: '#fff', marginLeft: 10 }}
								/>
								: null}
						</View>
					</View>
				</View>
				<View style={styles.headSelect}>
					<TouchableOpacity style={styles.headType} onPress={this._selecOpen}>
						<Text style={[styles.fontColor]}>{typeValue}</Text>
						<Image style={styles.headImg} source={imgUrl} />
					</TouchableOpacity>
					<TouchableOpacity style={styles.headType} onPress={() => { this._goSupplier() }}>
						<Text numberOfLines={1} style={[styles.fontColor]}>{companyName ? (companyName.length > 12 ? companyName.substr(0, 12) + "..." : companyName) : ""}
						</Text>
						{
							!this.onoff ? (<Image style={styles.headImg} source={imgUrl} />) : null
						}
					</TouchableOpacity>
				</View>
				{
					loader ?
						this._body()
						: (
							<View style={{ flex: 1 }}>
								<PageStatusIndex emptyText={'暂无授信账单'} status={'loading'} />
							</View>
						)
				}

				<Common type="modal" demoData={(
					<Common type="listRadio" selectIndex={typeIndex} title="选择授信类型" listData={typeData} selectCallBack={this._typeCallBack} />
				)} isVisible={typeModal} closeCallballFn={() => { this._closeModal({ typeModal }) }} />

				<SlideSelect alertShow={alertShow} options={options}
					select={(val) => {
						this.setState({ choice: val || options[0], alertShow: false }, () => {
							this._init();
						})
					}}
					unselect={() => {
						this.setState({ alertShow: false })
					}} />
			</View>
		)
	}

	_isTime = (time1) => {
		if (!time1) return;
		let oDate1 = new Date(); // 当前时间
		oDate1 = oDate1.getFullYear() + '-' + (oDate1.getMonth() + 1) + '-' + oDate1.getDate();
		return new Date(time1.replace(/-/g, "\/")) >= new Date(oDate1.replace(/-/g, "\/")) ? moment(time1).format('YYYY-MM-DD') : '';
	}

	_body = () => {
		let { tabIndex, typeValue, choice, tabLoading, showDetail, companyId } = this.state;
		let { remainAmount, realAmount, creditAmount, occupyAmount, accountDay, contractAmount, auditAmount, creditEndDate, creditStatusName,
			occupyAndChangeAmount, orderCount, orderChangeAmount, orderTotalAmount, instockNotPayAmount } = this.datialData;
		let tabReal = this.listData['REAL_OCCUPY'];
		let tabAudit = this.listData['AUDIT_OCCUPY'];
		let tabContract = this.listData['CONTRACT_OCCUPY'];
		let tabChange = this.listData['CHANGE_OCCUPY'];

		const shadowOpt = {
			width: 350 * scale,
			height: 120 * scale,
			color: "#000",//阴影颜色
			border: 20 * scale,//阴影宽度
			radius: 10 * scale,//包裹的子元素圆角多少这里必须是多少
			opacity: 0.3,//透明度
			x: 0,
			y: 20 * scale,
		}
		console.log(tabContract)
		return (
			<ScrollView>
				<View style={styles.tapBg}>
					<View style={styles.comBox}>
						<BoxShadow setting={shadowOpt}>
							<View style={styles.tap}>
								<View style={styles.tapTop}>
									<Text style={styles.topTopText}>{creditStatusName + '|账期:' + (accountDay != null ? accountDay + '天' : '--')}</Text>
								</View>
								<View style={{ marginTop: 20 * scale, marginLeft: 12 * scale }}>
									<Text style={styles.tapItemTitle}>授信总额<Text style={{ fontSize: 12 * scale, color: '#8c8c8c' }}>{this._isTime(creditEndDate) ? `（有效期至${this._isTime(creditEndDate)})` : '（已过期)'}</Text></Text>
									<Text style={styles.tapItemBody}>¥{(creditAmount != null) ? MethodUtil.toThousands(creditAmount, 2) : '--'}</Text>
								</View>
								<View style={styles.tapMid}>
									<View style={[styles.tapItem, styles.tapLeft]}>
										<Text style={styles.tapItemTitle}>剩余可申请</Text>
										<Text style={styles.tapItemBody}>¥{(creditAmount && occupyAndChangeAmount) ? MethodUtil.toThousands(creditAmount - occupyAndChangeAmount, 2) : '--'}</Text>
									</View>
									<View style={styles.tapItem}>
										<Text style={styles.tapItemTitle}>申请总占用（含变更增价）</Text>
										<Text style={styles.tapItemBody}>¥{(occupyAndChangeAmount != null) ? MethodUtil.toThousands(occupyAndChangeAmount, 2) : '--'}</Text>
									</View>
								</View>
							</View>
						</BoxShadow>
					</View>
					{/* <View style={{width:100,height:100,backgroundColor:'#fff'}}></View> */}
					<View style={{ marginTop: 40 * scale }}>
						{showDetail ?
							<View>
								<View>
									<Text style={[styles.tapInfo, { marginLeft: 80 * scale, marginTop: 10 * scale }]}>申请总占用（含变更增价）：¥{(occupyAndChangeAmount != null) ? MethodUtil.toThousands(occupyAndChangeAmount, 2) : '--'}</Text>
									<View style={styles.triangle}></View>
									<View style={styles.tapDetail}>
										<View style={styles.tapView}>
											<Text style={styles.tapInfoLeft}>订单审批中占用（提交至通过未双签）</Text>
											<Text style={styles.tapInfo}>¥{(auditAmount != null) ? MethodUtil.toThousands(auditAmount, 2) : '--'}</Text>
										</View>
										<View style={styles.tapView}>
											<Text style={styles.tapInfoLeft}>订单合同占用（已双签未付款）</Text>
											<Text style={styles.tapInfo}>¥{(contractAmount != null) ? MethodUtil.toThousands(contractAmount, 2) : '--'}</Text>
										</View>
										<View style={styles.tapView}>
											<Text style={styles.tapInfoLeft}>订单实际占用（已付款未入库）</Text>
											<Text style={styles.tapInfo}>¥{(realAmount != null) ? MethodUtil.toThousands(realAmount, 2) : '--'}</Text>
										</View>
										<View style={{ borderBottomWidth: 1 * scale, borderBottomColor: 'rgba(255,255,255,0.29)', marginBottom: 10 * scale }}>
										</View>
										<View style={styles.tapView}>
											<Text style={styles.tapInfoLeft}>(*合计：申请总占用（不含订单变更增价）</Text>
											<Text style={styles.tapInfo}>¥{(occupyAmount != null) ? MethodUtil.toThousands(occupyAmount, 2) : '--'})</Text>
										</View>
									</View>
								</View>
								<TouchableOpacity onPress={() => { this.setState({ showDetail: !showDetail }) }} style={{ alignItems: 'center', height: 30 * scale, justifyContent: 'center' }}>
									<Image style={[styles.headImg, { transform: [{ rotate: '180deg' }] }]} source={imgUrl} />
								</TouchableOpacity>
							</View>
							:
							<TouchableOpacity onPress={() => { this.setState({ showDetail: !showDetail }) }} style={{ width: '100%', height: 30 * scale, alignItems: 'center', justifyContent: 'center' }}>
								<Image style={styles.headImg} source={imgUrl} />
							</TouchableOpacity>
						}
					</View>
					{/* {/* <Text style={styles.tapInfo}>当前授信申请总占用：¥{(occupyAmount != null) ? MethodUtil.toThousands(occupyAmount, 2) : '--'}</Text> */}
				</View>
				<HeadTab data={this.tabData} initIndex={tabIndex} tabClick={this._tabClick} />
				<View style={styles.tabBox}>
					{
						tabIndex == 0 ? (
							<View style={styles.tabItem}>
								{instockNotPayAmount ?
									<TouchableOpacity
										style={{ backgroundColor: '#FFF7E3', paddingVertical: 9 * scale, paddingLeft: 12 * scale, paddingRight: 22 * scale, flexDirection: 'row', marginTop: 13 * scale, justifyContent: 'space-between', alignItems: 'center' }}
										onPress={() => { this.props.navigation.navigate('BillDetail', { companyId: companyId, corpId: choice.corpId, realAmount, instockNotPayAmount }) }}
									>
										<Text style={{ color: '#FA6400', fontSize: 12 * scale }}>采购授信订单已入库未付款：¥ {MethodUtil.toThousands(instockNotPayAmount, 2)}</Text>
										<Image source={require('../../../imgs/arrow.png')} style={{ height: 5 * scale, height: 11 * scale, tintColor: '#FA6400' }} />
									</TouchableOpacity> : null
								}
								<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
									<Text style={{ color: '#F66464', fontSize: 12 * scale, paddingTop: 12 * scale, color: '#848A96' }}>订单实际占用(元)</Text>
									<Text style={styles.tabTitle}>
										· {typeValue == "预付" ? '采购订单已付款未入库' : '销售订单已发货未收款'}
									</Text>
								</View>
								<Text style={[styles.fontBold, { marginBottom: 20 * scale }]}>¥{(realAmount != null) ? MethodUtil.toThousands(realAmount, 2) : '--'}</Text>
								{tabReal ? (
									<TabItem data={tabReal} active={true} navData={this.props} callBack={this._callBack} />
								) : (tabLoading ? <View style={styles.loadBox}><Loading bgShow={true} /></View> : this._rendenEmpty())
								}
							</View>
						) : null
					}
					{
						tabIndex == 1 ? (
							<View style={styles.tabItem}>
								<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
									<Text style={{ color: '#F66464', fontSize: 12 * scale, paddingTop: 12 * scale, color: '#848A96' }}>合同占用总额(元)</Text>
									<Text style={styles.tabTitle}>
										· {typeValue == "预付" ? '授信合同未付款' : '授信合同未发货'}
									</Text>
								</View>
								<Text style={[styles.fontBold, { marginBottom: 20 * scale }]}>¥{(contractAmount != null) ? MethodUtil.toThousands(contractAmount, 2) : '--'}</Text>
								{
									tabContract ? (
										<TabItem data={tabContract} navData={this.props} callBack={this._callBack} />
									) : (tabLoading ? <View style={styles.loadBox}><Loading bgShow={true} /></View> : this._rendenEmpty())
								}
							</View>
						) : null
					}
					{
						tabIndex == 2 ? (
							<View style={styles.tabItem}>
								<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
									<Text style={{ color: '#F66464', fontSize: 12 * scale, paddingTop: 12 * scale, color: '#848A96' }}>审批占用总额(元)</Text>
									<Text style={styles.tabTitle}>
										· {typeValue == "预付" ? '已提交成交报告未双签复核' : '已提交成交报告未双签复核'}
									</Text>
								</View>
								<Text style={[styles.fontBold, { marginBottom: 20 * scale }]}>¥{(auditAmount != null) ? MethodUtil.toThousands(auditAmount, 2) : '--'}</Text>
								{
									tabAudit ? (
										<TabItem data={tabAudit} navData={this.props} callBack={this._callBack} />
									) : (tabLoading ? <View style={styles.loadBox}><Loading bgShow={true} /></View> : this._rendenEmpty())
								}
							</View>
						) : null
					}
					{
						tabIndex == 3 ? (
							<View style={styles.tabItem}>
								<Text style={styles.colorRed}>(变更中)订单<Text style={styles.fontBold}>{orderCount || '0'}</Text>笔 | (变更中)订单总额<Text style={styles.fontBold}>¥{(orderTotalAmount != null) ? MethodUtil.toThousands(orderTotalAmount, 2) : '--'}</Text></Text>
								<Text style={[styles.colorRed, { paddingTop: 5 * scale, }]}>比原单总额增长<Text style={styles.fontBold}>¥{(orderChangeAmount != null) ? MethodUtil.toThousands(orderChangeAmount, 2) : '--'}</Text></Text>
								<Text style={styles.tabTitle}>
									变更中占用：因变更导致订单总额增加的授信订单
								</Text>
								{
									tabChange ? (
										<TabItem tabIndex={3} data={tabChange} navData={this.props} callBack={this._callBack} />
									) : (tabLoading ? <View style={styles.loadBox}><Loading bgShow={true} /></View> : this._rendenEmpty())
								}
							</View>
						) : null
					}
				</View>
			</ScrollView>
		)
	}


}
const styles = StyleSheet.create({
	container: {
		flex: 1,
		backgroundColor: style.color.bgGray
	},
	fontColor: {
		color: style.color.white,
		fontSize: 13 * scale
	},
	comBox: {
		marginTop: 10 * scale,
		flex: 1,
		flexDirection: 'row',
		justifyContent: 'center',
	},
	headBox: {
		paddingTop: 40 * scale,
		backgroundColor: style.color.themeColor,
		paddingBottom: 20 * scale,
	},
	topTitle: {
		flex: 1,
		fontSize: 18 * scale,
		color: '#fff',
		textAlign: 'center'
	},
	topBox: {
		flexDirection: 'row',
		alignItems: 'center',
		justifyContent: 'space-between',
		paddingHorizontal: 18
	},
	headSelect: {
		height: 48 * scale,
		paddingLeft: 30 * scale,
		paddingRight: 30 * scale,
		backgroundColor: style.color.themeColor,
		flexDirection: 'row',
		justifyContent: 'space-between',
		alignItems: 'center',
	},
	headType: {
		flexDirection: 'row',
		alignItems: 'center',
	},
	headImg: {
		marginLeft: 12 * scale,
		tintColor: '#fff',
	},
	tapBg: {
		// height: 195 * scale,
		width: '100%',
		backgroundColor: style.color.themeColor,
		// paddingBottom: 15 * scale
	},
	tap: {
		width: 350 * scale,
		height: 150 * scale,
		backgroundColor: style.color.white,
		borderRadius: 5 * scale,
		justifyContent: 'flex-start',
		flexDirection: 'column',
		// overflow: 'hidden'
	},
	tapTop: {
		width: 120 * scale,
		borderRadius: 2 * scale,
		height: 32 * scale,
		backgroundColor: '#F56060',
		position: 'absolute',
		top: 12 * scale,
		right: -5 * scale
	},
	topTopText: {
		color: '#fff',
		lineHeight: 32 * scale,
		fontSize: 12 * scale,
		textAlign: 'center',
	},
	tapAll: {
		fontSize: 11 * scale,
		color: '#6A8AC3',
		paddingLeft: 12 * scale,
		paddingTop: 5 * scale
	},
	tapAll2: {
		fontSize: 10 * scale,
		color: '#999',
	},
	tapLeft: {
		paddingLeft: 12 * scale
	},
	tapMid: {
		width: '100%',
		flexDirection: 'row',
		marginTop: 20 * scale,
		marginBottom: 5 * scale,
	},
	tapItem: {
		width: '50%',
	},
	tapItemTitle: {
		color: '#8C8C8C',
		fontSize: 12 * scale,
		paddingBottom: 8 * scale
	},
	tapItemBody: {
		fontSize: 14 * scale,
		color: '#000000',
		fontWeight: 'bold',
	},
	tapInfo: {
		fontSize: 12 * scale,
		color: '#fff',
		// marginTop: 25 * scale,
		// marginLeft: 50 * scale
	},
	tabBox: {
		paddingLeft: 15 * scale,
		paddingRight: 15 * scale,
		paddingBottom: 15 * scale,
		height: '100%',
	},
	colorRed: {
		color: '#F66464',
		fontSize: 12 * scale,
		paddingTop: 12 * scale,
	},
	tabTitle: {
		fontSize: 12 * scale,
		borderBottomWidth: 1 / PixelRatio.get(),
		borderStyle: 'solid',
		borderBottomColor: style.color.gray,
		paddingTop: 12 * scale,
		paddingBottom: 12 * scale
	},
	listItem: {
		paddingTop: 18 * scale
	},
	itemTitle: {
		fontSize: 13 * scale,
		color: '#404040',
		marginBottom: 10 * scale,
		fontWeight: 'bold',
	},
	itemKe: {
		paddingTop: 15 * scale,
		paddingBottom: 15 * scale,
		borderRadius: 10 * scale,
		backgroundColor: style.color.white,
	},
	time: {
		color: '#404040',
		fontSize: 12 * scale,
		width: 120 * scale,
		marginLeft: 15 * scale
	},
	money: {
		color: '#404040',
		fontSize: 12 * scale
	},
	pt8: {
		paddingTop: 8 * scale
	},
	line: {
		borderBottomWidth: 1 / PixelRatio.get(),
		borderStyle: 'solid',
		borderBottomColor: style.color.gray,
		marginBottom: 15 * scale,
	},
	line2: {
		marginBottom: 15 * scale,
	},
	oldDay: {
		color: '#D48400'
	},
	listout: {
		flexDirection: 'row',
		alignItems: 'center',
	},
	tabItem: {
		flex: 1
	},
	loadBox: { height: '100%', justifyContent: 'center', alignItems: 'center' },
	fontBold: { fontSize: 14 * scale, fontWeight: 'bold' },
	triangle: {
		marginLeft: 240,
		width: 0,
		height: 0,
		borderStyle: 'solid',
		borderWidth: 12,
		borderTopColor: 'transparent',//下箭头颜色
		borderLeftColor: 'transparent',//右箭头颜色
		borderBottomColor: '#fff',//上箭头颜色
		borderRightColor: 'transparent',//左箭头颜色
		opacity: 0.2
	},
	tapDetail: {
		backgroundColor: 'rgba(255,255,255,0.2)',
		paddingLeft: 10 * scale,
		paddingRight: 18 * scale,
		paddingTop: 15 * scale,
		marginHorizontal: 15 * scale,
		marginBottom: 16 * scale
	},
	tapInfoLeft: {
		width: 240 * scale,
		fontSize: 12 * scale,
		color: '#fff',
		textAlign: 'right'
	},
	tapView: {
		flexDirection: 'row',
		justifyContent: 'space-between',
		marginBottom: 10 * scale
	}
})